<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>fixed居中</title>
    <style>
      body {
        padding: 0;
        margin: 0;
        font-size: 22px;
      }
      .content-left {
        width: 256px;
        min-width: 256px;
        max-width: 256px;
        flex: 0 0 256px;
        overflow: hidden;
        height: 100vh;
        background: orange;
      }
      .content-right {
        height: 900px;
      }
      .fixed-c {
        height: 80px;
        width: 90%;
        position: fixed;
        margin: auto;
        bottom: 0; /*底部固定*/
        left: 0; /*实现div的居中*/
        right: 0; /*实现div的居中*/
        text-align: center; /*div的内容居中*/
        background: red;
        line-height: 80px; /*垂直居中*/
      }
    </style>
  </head>
  <body>
    <div style="display: flex;">
      <div class="content-left">
        左侧任意内容
      </div>
      <div style="flex: auto;">
        <div class="content-right">
          右侧任意内容
        </div>
      </div>
      <div class="fixed-c">
        fixed底部固定，且要居中
      </div>
    </div>
  </body>
</html>